<template>
  <div>
    <el-dialog
      title="评价详情"
      :visible="open"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
      width="600px"
      append-to-body
      @close="cancel()"
    >
      <div class="titleLineGreen">评价信息</div>
      <el-form
        ref="form1"
        style="margin-top: 20px"
        :model="form"
        label-width="80px"
      >
        <el-row>
          <el-col :span="12">
            <el-form-item label="教师" prop="uncheckReason">
              <div style="white-space: pre-wrap">
                {{ form.teacherName }}
              </div>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="课程" prop="uncheckReason">
              <div style="white-space: pre-wrap">
                {{ form.courseName }}
              </div>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="评价人" prop="uncheckReason">
              <div style="white-space: pre-wrap">
                {{ form.name }}({{ form.studentNum }})
              </div>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="评价时间" prop="uncheckReason">
              <div style="white-space: pre-wrap">
                {{ parseTime(form.studentEvaluateTime) }}
              </div>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div class="titleLineGreen">评价详情</div>
      <el-form
        ref="form1"
        style="margin-top: 20px"
        :model="form"
        label-width="80px"
      >
        <el-row>
          <el-col :span="12">
            <el-form-item label="总分" prop="total">
              <div style="height: 36px" class="flexColCenter">
                <el-rate
                  :value="item.total ? item.total.toFixed(1) : 0"
                  disabled
                  show-score
                  text-color="#ff9900"
                  score-template="{value}分"
                >
                </el-rate>
              </div>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="设备整齐" prop="equipmentStar">
              <div style="height: 36px" class="flexColCenter">
                <el-rate
                  :value="form.equipmentStar ? form.equipmentStar : 0"
                  disabled
                  show-score
                  text-color="#ff9900"
                  score-template="{value}分"
                >
                </el-rate>
              </div>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="场地整洁" prop="envStar">
              <div style="height: 36px" class="flexColCenter">
                <el-rate
                  :value="form.envStar ? form.envStar : 0"
                  disabled
                  show-score
                  text-color="#ff9900"
                  score-template="{value}分"
                >
                </el-rate>
              </div>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="管理得当" prop="managerStar">
              <div style="height: 36px" class="flexColCenter">
                <el-rate
                  :value="form.managerStar ? form.managerStar : 0"
                  disabled
                  show-score
                  text-color="#ff9900"
                  score-template="{value}分"
                >
                </el-rate>
              </div>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div class="titleLineGreen">评价文案</div>
      <el-form
        ref="form3"
        style="margin-top: 20px"
        :model="form"
        label-width="80px"
      >
        <el-row>
          <el-col :span="24">
            <el-form-item label="评价" prop="uncheckReason">
              <div style="white-space: pre-wrap">
                {{
                  form.commentToWorkstation ? form.commentToWorkstation : '--'
                }}
              </div>
            </el-form-item>
          </el-col>
        </el-row
        >
      </el-form>
      <div
        slot="footer"
        class="dialog-footer"
        style="display: flex; justify-content: flex-end"
      >
        <el-button v-preventReClick @click="cancel">关 闭</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { getPost_evaluateInfo } from '@/api/course/course'
import { parseTime } from '@/utils/cc'

export default {
  props: {
    open: Boolean,
    item: Object
  },
  data() {
    return {
      form: {}
    }
  },
  watch: {
    async open(e) {
      if (e) {
        let res = await getPost_evaluateInfo(this.item.courseStuId)
        this.form = res.data
      }
    }
  },
  mounted() {
  },
  methods: {
    parseTime,
    cancel() {
      this.$emit('update:open', false)
      this.reset()
    },
    reset() {
      this.$refs['form1'].resetFields()
      this.$refs['form3'].resetFields()
    }
  }
}
</script>
<style scoped lang="scss">
</style>
